<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Ticket Sales Detail</title>
<link rel="stylesheet" href="./css/airline.css">
<link rel="stylesheet"
	href="./css/font-awesome-4.7.0/css/font-awesome.min.css">
<script src="./js/jquery-3.4.1.min.js"></script>
<script src="./js/detail.js"></script>
</head>
<body>
	<div class="top">
		<div class="logo">
			<img class="logoimg" src="./image/logo/logo1.png" alt="">
		</div>
		<div class="status">Administrator Menu</div>
	</div>
	<div class="headline">
		<div class="headtitle">Ticket Sales Detail</div>
		<div class="editbutton">
			<a href="./AdministratorMenu.html"> <input
				style="width: 60px; height: 20px;" type="button" name="" id=""
				value="Exit" />
			</a>
		</div>
	</div>
	<div class="info"></div>
	<div class="flightimg">
		<img src="./image/737-800.jpg " alt=""> <img
			src="./image/319.jpg" alt="" style="display: none;">
	</div>
	<div class="seatmsg">
		<div class="ticketmsg">
			<div class="cabinmsg">
				<p class="classtitle">First Class</p>
				<p>2/8 25%</p>
				<p>Total Tickets:8</p>
				<p>Sold Tickets:2</p>
				<p>Seats Selected:2</p>
			</div>
			<div class="cabinmsg">
				<p class="classtitle">Business Class</p>
				<p>40/60 66.67%</p>
				<p>Total Tickets:60</p>
				<p>Sold Tickets:40</p>
				<p>Seats Selected:5</p>
			</div>
			<div class="cabinmsg" style="margin: 0 0 0 100px;">
				<p class="classtitle">Economy Class</p>
				<p>52/120 43.33%</p>
				<p>Total Tickets:52</p>
				<p>Sold Tickets:120</p>
				<p>Seats Selected:9</p>
			</div>
		</div>
		<div class="seatimg">
			<div class="firstclass">
				<div class="seatstyle selected" data-name="1L">1L</div>
				<div class="seatstyle" data-name="2L">2L</div>
				<div class="seatstyle selected" data-name="1J">1J</div>
				<div class="seatstyle" data-name="2J">2J</div>
				<div class="seatstyle aisleseat" data-name="1C">1C</div>
				<div class="seatstyle aisleseat" data-name="2C">2C</div>
				<div class="seatstyle" data-name="1A">1A</div>
				<div class="seatstyle " data-name="2A">2A</div>
			</div>
			<div class="businessclass">
				<!-- <div class="seatline">
                        <div class="busseat selected" data-name="3L">3L</div>
                        <div class="busseat" data-name="4L">4L</div>
                        <div class="busseat" data-name="5L">5L</div>
                        <div class="busseat" data-name="6L">6L</div>
                        <div class="busseat" data-name="7L">7L</div>
                        <div class="busseat selected" data-name="8L">8L</div>
                        <div class="busseat selected" data-name="9L">9L</div>
                        <div class="busseat" data-name="10L">10L</div>
                        <div class="busseat" data-name="11L">11L</div>
                        <div class="busseat" data-name="12L">12L</div>
                    </div>
                    <div class="seatline">
                        <div class="busseat" data-name="3K">3K</div>
                        <div class="busseat" data-name="4K">4K</div>
                        <div class="busseat" data-name="5K" >5K</div>
                        <div class="busseat" data-name="6K">6K</div>
                        <div class="busseat" data-name="7K">7K</div>
                        <div class="busseat" data-name="8K">8K</div>
                        <div class="busseat" data-name="9K">9K</div>
                        <div class="busseat" data-name="10K">10K</div>
                        <div class="busseat" data-name="11K">11K</div>
                        <div class="busseat" data-name="12K">12K</div>
                    </div>
                    <div class="seatline">
                        <div class="busseat" data-name="3J" >3J</div>
                        <div class="busseat" data-name="4J">4J</div>
                        <div class="busseat" data-name="5J">5J</div>
                        <div class="busseat" data-name="6J">6J</div>
                        <div class="busseat" data-name="7J">7J</div>
                        <div class="busseat" data-name="8J">8J</div>
                        <div class="busseat" data-name="9J">9J</div>
                        <div class="busseat" data-name="10J">10J</div>
                        <div class="busseat" data-name="11J">11J</div>
                        <div class="busseat" data-name="12J">12J</div>
                    </div>
                    <div class="seatline" style="margin-top: 20px;">
                        <div class="busseat" data-name="3C">3C</div>
                        <div class="busseat" data-name="4C">4C</div>
                        <div class="busseat" data-name="5C">5C</div>
                        <div class="busseat" data-name="6C" >6C</div>
                        <div class="busseat" data-name="7C">7C</div>
                        <div class="busseat" data-name="8C">8C</div>
                        <div class="busseat" data-name="9C">9C</div>
                        <div class="busseat" data-name="10C">10C</div>
                        <div class="busseat" data-name="11C">11C</div>
                        <div class="busseat" data-name="12C">12C</div>
                    </div>
                    <div class="seatline">
                        <div class="busseat" data-name="3B">3B</div>
                        <div class="busseat" data-name="4B">4B </div>
                        <div class="busseat selected" data-name="5B">5B</div>
                        <div class="busseat" data-name="6B">6B</div>
                        <div class="busseat" data-name="7B">7B</div>
                        <div class="busseat" data-name="8B">8B</div>
                        <div class="busseat" data-name="9B">9B</div>
                        <div class="busseat" data-name="10B">10B</div>
                        <div class="busseat" data-name="11B">11B</div>
                        <div class="busseat" data-name="12B">12B</div>
                    </div>
                    <div class="seatline">
                        <div class="busseat" data-name="3A">3A</div>
                        <div class="busseat" data-name="4A">4A</div>
                        <div class="busseat selected" data-name="5A">5A</div>
                        <div class="busseat" data-name="6A">6A</div>
                        <div class="busseat" data-name="7A">7A</div>
                        <div class="busseat" data-name="8A">8A</div>
                        <div class="busseat" data-name="9A">9A</div>
                        <div class="busseat" data-name="10A">10A</div>
                        <div class="busseat" data-name="11A">11A</div>
                        <div class="busseat" data-name="12A">12A</div>
                    </div> -->
			</div>

			<div class="economyclass">
				<!-- <div class="ecoline">
                        <div class="busseat selected" data-name="">13L</div>
                        <div class="busseat" data-name="">14L</div>
                        <div class="busseat" data-name="">15L</div>
                        <div class="busseat" data-name="">16L</div>
                        <div class="busseat" data-name="">17L</div>
                        <div class="busseat selected" data-name="">18L</div>
                        <div class="busseat selected" data-name="">19L</div>
                        <div class="busseat" data-name="">20L</div>
                        <div class="busseat" data-name="">21L</div>
                        <div class="busseat" data-name="">22L</div>
                        <div class="busseat" data-name="">23L</div>
                        <div class="busseat" data-name="">24L</div>
                        <div class="busseat" data-name="">25L</div>
                        <div class="busseat" data-name="">26L</div>
                        <div class="busseat" data-name="">27L</div>
                        <div class="busseat" data-name="">28L</div>
                        <div class="busseat" data-name="">29L</div>
                        <div class="busseat" data-name="">30L</div>
                        <div class="busseat" data-name="">31L</div>
                        <div class="busseat" data-name="">32L</div>
                    </div>
                    <div class="ecoline">
                        <div class="busseat selected" data-name="">13K</div>
                        <div class="busseat" data-name="">14K</div>
                        <div class="busseat" data-name="">15K</div>
                        <div class="busseat" data-name="">16K</div>
                        <div class="busseat" data-name="">17K</div>
                        <div class="busseat" data-name="">18K</div>
                        <div class="busseat" data-name="">19K</div>
                        <div class="busseat" data-name="">20K</div>
                        <div class="busseat selected" data-name="">21K</div>
                        <div class="busseat" data-name="">22K</div>
                        <div class="busseat selected" data-name="">23K</div>
                        <div class="busseat" data-name="">24K</div>
                        <div class="busseat" data-name="">25K</div>
                        <div class="busseat" data-name="">26K</div>
                        <div class="busseat" data-name="">27K</div>
                        <div class="busseat" data-name="">28K</div>
                        <div class="busseat" data-name="">29K</div>
                        <div class="busseat" data-name="">30K</div>
                        <div class="busseat" data-name="">31K</div>
                        <div class="busseat" data-name="">32K</div>
                    </div>
                    <div class="ecoline">
                        <div class="busseat" data-name="">13J</div>
                        <div class="busseat" data-name="" >14J</div>
                        <div class="busseat" data-name="">15J</div>
                        <div class="busseat" data-name="">16J</div>
                        <div class="busseat selected" data-name="">17J</div>
                        <div class="busseat" data-name="">18J</div>
                        <div class="busseat" data-name="">19J</div>
                        <div class="busseat" data-name="">20J</div>
                        <div class="busseat" data-name="">21J</div>
                        <div class="busseat" data-name="">22J</div>
                        <div class="busseat" data-name="">23J</div>
                        <div class="busseat" data-name="">24J</div>
                        <div class="busseat" data-name="">25J</div>
                        <div class="busseat" data-name="">26J</div>
                        <div class="busseat" data-name="">27J</div>
                        <div class="busseat" data-name="">28J</div>
                        <div class="busseat" data-name="">29J</div>
                        <div class="busseat" data-name="">30J</div>
                        <div class="busseat" data-name="">31J</div>
                        <div class="busseat" data-name="">32J</div>
                    </div>
                    <div class="ecoline" style="margin-top: 20px;" >
                        <div class="busseat" data-name="">13C</div>
                        <div class="busseat" data-name="">14C</div>
                        <div class="busseat" data-name="">15C</div>
                        <div class="busseat" data-name="">16C</div>
                        <div class="busseat selected" data-name="">17C</div>
                        <div class="busseat" data-name="">18C</div>
                        <div class="busseat" data-name="">19C</div>
                        <div class="busseat" data-name="">20C</div>
                        <div class="busseat" data-name="">21C</div>
                        <div class="busseat" data-name="">22C</div>
                        <div class="busseat" data-name="">23C</div>
                        <div class="busseat" data-name="">24C</div>
                        <div class="busseat" data-name="">25C</div>
                        <div class="busseat" data-name="">26C</div>
                        <div class="busseat" data-name="">27C</div>
                        <div class="busseat" data-name="">28C</div>
                        <div class="busseat" data-name="">29C</div>
                        <div class="busseat" data-name="">30C</div>
                        <div class="busseat" data-name="">31C</div>
                        <div class="busseat" data-name="">32C</div>
                    </div>
                    <div class="ecoline">
                        <div class="busseat" data-name="">13B</div>
                        <div class="busseat" data-name="">14B</div>
                        <div class="busseat" data-name="">15B</div>
                        <div class="busseat" data-name="">16B</div>
                        <div class="busseat" data-name="">17B</div>
                        <div class="busseat" data-name="">18B</div>
                        <div class="busseat" data-name="">19B</div>
                        <div class="busseat" data-name="">20B</div>
                        <div class="busseat" data-name="">21B</div>
                        <div class="busseat" data-name="">22B</div>
                        <div class="busseat" data-name="">23B</div>
                        <div class="busseat" data-name="">24B</div>
                        <div class="busseat" data-name="">25B</div>
                        <div class="busseat" data-name="">26B</div>
                        <div class="busseat" data-name="">27B</div>
                        <div class="busseat" data-name="">28B</div>
                        <div class="busseat" data-name="">29B</div>
                        <div class="busseat" data-name="">30B</div>
                        <div class="busseat" data-name="">31B</div>
                        <div class="busseat" data-name="">32B</div>
                    </div>
                    <div class="ecoline">
                        <div class="busseat" data-name="">13A</div>
                        <div class="busseat" data-name="">14A</div>
                        <div class="busseat" data-name="" >15A</div>
                        <div class="busseat selected" data-name="">16A</div>
                        <div class="busseat" data-name="">17A</div>
                        <div class="busseat" data-name="">18A</div>
                        <div class="busseat" data-name="">19A</div>
                        <div class="busseat" data-name="">20A</div>
                        <div class="busseat" data-name="">21A</div>
                        <div class="busseat" data-name="">22A</div>
                        <div class="busseat" data-name="">23A</div>
                        <div class="busseat" data-name="">24A</div>
                        <div class="busseat" data-name="">25A</div>
                        <div class="busseat" data-name="">26A</div>
                        <div class="busseat" data-name="">27A</div>
                        <div class="busseat" data-name="">28A</div>
                        <div class="busseat" data-name="">29A</div>
                        <div class="busseat" data-name="">30A</div>
                        <div class="busseat" data-name="">31A</div>
                        <div class="busseat" data-name="">32A</div>
                    </div> -->
			</div>
		</div>
	</div>
</html>